<template>
	<view class="cu-modal" :class="showDialog || showVersionDialog ? 'show' : ''" @tap="hideModal">
		
		<view class="cu-dialog" v-if="modalName == 'link'" @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚猜您想买</view>
			<view class="flex flex-wrap padding-tb">
				<view class="basis-sm imgItem padding-left-sm"><image :src="pItem.pictUrl" class="picItem" mode="aspectFit" lazy-load /></view>
				<view class="basis-df padding-left-sm">
					<view class="titleItem">{{ pItem.title }}</view>
					<view v-show="false">{{ searchContent }}</view>
					<view class="juanInfo" @tap="goShare">分享 赚￥{{ pItem.commissionAmount | Fixed2 }}</view>
					<view class="text-red text-bold text-xl flex justify-start margin-top-sm">￥{{ pItem.zkFinalPrice | Fixed2 }}</view>
				</view>
			</view>
			<view class="cu-bar bg-white justify-around action" @tap.stop="">
				<button class="cu-btn round line-orange" hover-class="none" @tap="goProduct">查看详情</button>
				<!-- #ifdef APP-PLUS -->
				<button class="cu-btn round bg-pink margin-left" hover-class="none" @tap="navTaobao">
					购买省￥{{ pItem.commissionAmount, pItem.couponAmount | commissionCoupon }}
				</button>
				<!-- #endif -->
				<!-- #ifdef MP-WEIXIN -->
				<button class="cu-btn round bg-pink margin-left" hover-class="none" @tap="copyWord">复制淘口令</button>
				<!-- #endif -->
			</view>
		</view>
		<view class="cu-dialog" v-else-if="modalName == 'alert'" @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚未搜索到以下内容</view>
			<view class="padding text-left text-lg">{{ searchContent }}</view>
			<view class="cu-bar bg-white justify-around action"><button class="cu-btn round bg-gray" @tap="hideModal" hover-class="none">确  定</button></view>
		</view>
		<view class="cu-dialog" v-else-if="modalName == 'login'" @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚提醒您</view>
			<view class="flex justify-center padding text-left text-lg">为了保障您的收益，请先登录</view>
			<view class="cu-bar bg-white justify-around action">
				<button class="cu-btn round bg-gray padding-lr-xl" @tap="hideModal" hover-class="none">取  消</button>
				<button class="cu-btn round bg-pink padding-lr-xl" @tap="login" hover-class="none">登  录</button>
			</view>
		</view>
		<view class="cu-dialog" v-else-if="modalName == 'version'" @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚版本更新</view>
			<view class="flex justify-center padding text-left text-lg">有新版本可更新</view>
			<view class="cu-bar bg-white justify-around action">
				<button class="cu-btn round bg-gray padding-lr-xl" @tap="hideModal" hover-class="none">下次，谢谢</button>
				<button class="cu-btn round bg-pink padding-lr-xl" @tap="updateVersion" hover-class="none">立刻更新</button>
			</view>
		</view>
		<view class="cu-dialog" v-else-if="modalName == 'versionNow'" @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚版本更新</view>
			<view class="flex justify-center padding text-left text-lg">有新版本可更新</view>
			<view class="cu-bar bg-white justify-around action"><button class="cu-btn round bg-pink padding-lr-xl" @tap="updateVersion" hover-class="none">立刻更新</button></view>
		</view>
		<view class="cu-dialog" v-else @tap.stop="">
			<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚超级搜</view>
			<view class="padding text-left text-lg">{{ searchContent }}{{modalName}}</view>
			<view class="cu-bar bg-white justify-around action">
				<button class="cu-btn round bg-gray" hover-class="none" @tap="hideModal">取  消</button>
				<button class="cu-btn round bg-pink margin-left" hover-class="none" @tap="search">搜  索</button>
			</view>
		</view>
	</view>
</template>

<script>
import clipboard from '@/common/clipboard.js';
var _self;
export default {
	props: {
		pageType: {
			type: String,
			default: 'other'
		}
	},
	data() {
		return {
			modalName: '', //'text','link','alert'
			pItem: [],
			showVersionDialog: false
		};
	},
	computed: {
		showDialog() {
			this.testClipboard();
			return this.$store.state.searchDialog;
		},
		searchContent() {
			return this.$store.state.searchContent;
		}
	},
	created() {
		_self = this;
	},
	methods: {
		//检查搜索内容
		testClipboard() {
			let tmpcnt = this.$store.state.searchContent;
			//console.log('tmpcnt='+tmpcnt);
			//console.log('this.$store.state.version_update=', this.$store.state.version_update, 'this.$store.state.version=', this.$store.state.version);
			//需要更新版本
			if (this.pageType == 'index' && this.$store.state.version_update > this.$store.state.version) {
				//console.log('需要更新版本')
				_self.showVersionDialog = true;
				_self.modalName = this.$store.state.version_force_update ? 'versionNow' : 'version';
			} else {
				if (tmpcnt.length > 0) {
					const param = {
						currentPage: 1,
						pageSize: 2,
						condition: {
							keyword: tmpcnt,
							sortType: 'total_sales',
							sort: '_des'
						}
					};
					_self.$http.httpRequest('taobao/product/search', param, false).then(res => {
						if (res._tranStatus) {
							let tmpItems = res._data.pageItems;
							if (tmpItems.length > 1) {
								_self.modalName = 'text';
								//console.log('a_self.modalName=',_self.modalName)
							} else {
								_self.modalName = 'link';
								_self.pItem = tmpItems[0];
								//console.log('b_self.modalName=',_self.modalName)
							}
						} else {
							_self.modalName = 'alert';
							//console.log('c_self.modalName=',_self.modalName)
						}
					});
					//console.log('d_self.modalName=',_self.modalName)
				}else{
					_self.modalName = 'text';
				}
				console.log('e_self.modalName=',_self.modalName)
			}
		},
		goShare() {
			//分享
			if (_self.$util.Landing()) {
				if (_self.$util.ExistRelationId()) {
					_self.hideModal();
					//跳转至分享页面
					uni.navigateTo({
						url: 'share?cnt=' + encodeURIComponent(JSON.stringify(_self.pItem))
					});
				}
			} else {
				_self.modalName = 'login';
			}
		},
		goProduct() {
			//查看详情
			_self.hideModal();
			uni.navigateTo({
				url: '../product/main?cnt=' + encodeURIComponent(JSON.stringify(_self.pItem))
			});
		},
		navTaobao() {
			//立即购买 去 淘宝
			if (_self.$util.Landing()) {
				if (_self.$util.ExistRelationId()) {
					//#ifdef APP-PLUS
					_self.hideModal();
					setTimeout(() => {
						let plug = uni.requireNativePlugin('UZK-Alibcsdk');
						let url = _self.pItem.promotedUrl + '&relationId=' + _self.$util.getRelationId();
						plug.init(result => {
							plug.openurl({
								url: url,
								linkkey: 'taobao',
								adzoneid: '103062550066',
								pid: 'mm_1159700186_1658850404_110381300098',
								nativeFailedMode: 'download',
								appkey: '29510703',
								opentype: 'native'
							});
						});
					}, 200);

					//#endif
				}
			} else {
				_self.modalName = 'login';
			}
		},
		copyWord() {
			//复制淘口令
			//#ifdef MP-WEIXIN
			if (_self.$util.Landing()) {
				_self.hideModal();
				_self.$util.taoKouLingCreate(_self.pItem.promotedUrl).then(res => {
					uni.setClipboardData({
						data: res
					});
				});
			} else {
				_self.modalName = 'login';
			}
			//#endif
		},
		login() {
			//确认登录
			uni.navigateTo({
				url: '../access/main'
			});
		},
		search() {
			let tmpcnt = this.$store.state.searchContent;
			_self.$util.setSearchHistory(tmpcnt, _self.$store.state.searchTBStorageHistory);
			_self.hideModal();
			uni.navigateTo({
				url: '../sou/list?cnt=' + encodeURIComponent(JSON.stringify(tmpcnt))
			});
		},
		updateVersion() {
			_self.$store.commit('updateVesion');
			_self.hideModal();
			
			
			/* 
			if (plus.os.name == "Android") {
			    let appurl = "market://details?id=自己的包名"; //这个是通用应用市场，如果想指定某个应用商店，需要单独查这个应用商店的包名或scheme及参数
			    plus.runtime.openURL(appurl);
			} */
		},
		hideModal() {
			if (!_self.$store.state.version_force_update) {
				_self.showVersionDialog = false;
				_self.modalName = '';
				//#ifdef APP-PLUS
				clipboard.setText('');
				//#endif
				//#ifdef MP-WEIXIN
				uni.setClipboardData({
					data: '',
					complete: function() {
						uni.hideToast();
					}
				});
				//#endif
				_self.$store.commit('hideSearchDialog');
			}
		}
	}
};
</script>

<style lang="scss">
.imgItem {
	display: flex;
	align-items: flex-start;
	.picItem {
		margin: 2rpx;
		width: 250rpx;
		height: 250rpx;
	}
}
.titleItem {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	width: 100%;
}
.juanInfo {
	height: 70rpx;
	margin-top: 20rpx;
	width: 80%;
	padding-left: 20rpx;
	background-image: linear-gradient(45deg, #ec79be, #e83844);
	color: #fff;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	border-radius: 6rpx;
}
</style>
